<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="tfn" uri="http://www.totoro.com/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/public.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/nav.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/iconFont/iconfont.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/seller/render.css"/>
    <!-- import CSS -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <style>
        .el-table .cell.el-tooltip {
            white-space: inherit !important;
        }
        body, button, input, select, textarea {
            font: 12px/1.5 tahoma,arial,'Hiragino Sans GB',"Microsoft Yahei",\5b8b\4f53,sans-serif;
            -webkit-font-smoothing: antialiased;
        }
        .el-table .warning-row {
            background: #fdf5e6;
        }

        .el-table .success-row {
            background: #fff;
        }
        .el-form-item__content{
            margin-left: 0px !important;
        }
        .el-table__empty-block{
            height: 0px !important;
        }
    </style>
</head>
<body>
<!-- import Vue before Element -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- import JavaScript -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="/static/js/frame/totoro-utils.js"></script>
<script src="/static/js/frame/jquery-3.5.1.min.js"></script>

<jsp:include page="/public_page/nav.jsp"></jsp:include>
<div id="page" style="margin-top: 50px;">
    <div id="mytaobao-panel" class="layout grid-s140m0">
        <div class="col-main">
            <div id="J_Region" class="main-wrap">
                <div id="root">
                    <div data-reactroot="" class="engine-app" id="_root">
                        <div class="com-struct page-root-struct" id="root">
                            <div class="next-loading ol-next-loading block list-page-loading">
                                <div class="next-loading-component">
                                    <div class="com-struct page-ceiling-struct" id="ceiling-struct">
                                        <div class="manage-card manage-card block">
                                            <div class="manage-card-head"><p class="manage-card-title"><i
                                                    class="next-icon next-icon-edit next-icon-medium manage-card-icon"></i><span
                                                    class="manage-card-title-content">官方公告</span></p></div>
                                            <div class="manage-card-content">
                                                <div class="manage-notice block"><i
                                                        class="next-icon next-icon-warning2 next-icon-medium manage-notice-icon"></i>
                                                    <div class="manage-notice-content">
                                                        <div class="sell-o-rich-text manage-notice-content-item"><font
                                                                color="red">1、您好，当前是升级后的新版淘宝商品管理页！如您在使用过程中遇到任何问题，可以反馈到旺旺群2662906756，我们会持续优化。</font>
                                                        </div>
                                                        <div class="sell-o-rich-text manage-notice-content-item">
                                                            2、若宝贝90天内无编辑、流量或出售的行为，系统将把宝贝作为滞销商品下架至 <a
                                                                href="//notice.taobao.com/unsalable.htm"
                                                                target="_blank">滞销下架宝贝</a> 。
                                                        </div>
                                                        <div class="sell-o-rich-text manage-notice-content-item">
                                                            3、您好，若需要管理全店或商品维度的销售范围（原区域限售），<a
                                                                href="//inventorymanage.tmall.com/index.htm?homeTab=salesScopeManage&amp;salesScope=salesScopeSetting"
                                                                target="_blank">请点击此链接去设置</a>。
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="manage-card manage-card block">
                                            <div class="manage-card-head"><p class="manage-card-title"><i
                                                    class="next-icon next-icon-edit next-icon-medium manage-card-icon"></i><span
                                                    class="manage-card-title-content">官方工具</span></p></div>
                                            <div class="manage-card-content">
                                                <div class="manage-link-list manage-link-list block"><a target="__blank"
                                                                                                        href="/seller/productCategory.htm"
                                                                                                        name="smartPublish"
                                                                                                        class="next-btn next-btn-text next-btn-normal next-btn-medium manage-link-list-button link-button"
                                                                                                        style="width: 125px;"><i
                                                        class="next-icon next-icon-lights next-icon-medium next-icon-first manage-link-list-item-icon item-icon"
                                                        style="color: rgb(120, 180, 255);"></i><span
                                                        class="manage-link-list-item-content">智能发布</span></a>
                                                    <a
                                                        target="_blank"
                                                        href="/seller/productRecycle.htm"
                                                        class="next-btn next-btn-text next-btn-normal next-btn-medium manage-link-list-button link-button"
                                                        style="width: 125px;"><i
                                                        class="next-icon next-icon-shangpinhuishouzhan next-icon-medium next-icon-first manage-link-list-item-icon item-icon"
                                                        style="color: rgb(71, 198, 164);"></i><span
                                                        class="manage-link-list-item-content">商品回收站</span></a>
                                                    <a
                                                        target="__blank"
                                                        href="/seller/productRecycle.htm"
                                                        name="history"
                                                        class="next-btn next-btn-text next-btn-normal next-btn-medium manage-link-list-button link-button"
                                                        style="width: 125px;"><i
                                                        class="next-icon next-icon-history next-icon-medium next-icon-first manage-link-list-item-icon item-icon"
                                                        style="color: rgb(247, 138, 76);"></i><span
                                                        class="manage-link-list-item-content">历史宝贝记录</span></a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div id="app">
                                    <div class="next-tabs next-tabs-wrapped next-tabs-medium next-tabs-top manage-container-tab list-page-tab">
                                        <div role="tablist" class="next-tabs-bar" tabindex="0">
                                            <div class="next-tabs-nav-container">
                                                <div class="next-tabs-nav-wrap">
                                                    <div class="next-tabs-nav-scroll">
                                                        <div class="next-tabs-nav"
                                                             style="transform: translate3d(0px, 0px, 0px);">
                                                            <div role="tab" aria-disabled="false" aria-selected="false"
                                                                 :class="(filter.productStatus==9999?'active next-tabs-tab next-tabs-nav-appear next-tabs-nav-appear-active':'next-tabs-tab next-tabs-nav-appear next-tabs-nav-appear-active')"
                                                                 @click="filter.productStatus = 9999; getNewData(false)">
                                                                <div class="next-tabs-tab-inner">全部宝贝</div>
                                                            </div>
                                                            <div role="tab" aria-disabled="false" aria-selected="true"
                                                                 :class="(filter.productStatus==1?'active next-tabs-tab next-tabs-nav-appear next-tabs-nav-appear-active':'next-tabs-tab next-tabs-nav-appear next-tabs-nav-appear-active')"
                                                                 @click="filter.productStatus = 1; getNewData(false)">
                                                                <div class="next-tabs-tab-inner">出售中的宝贝</div>
                                                            </div>
                                                            <div role="tab" aria-disabled="false" aria-selected="false"
                                                                 :class="(filter.productStatus==0?'active next-tabs-tab next-tabs-nav-appear next-tabs-nav-appear-active':'next-tabs-tab next-tabs-nav-appear next-tabs-nav-appear-active')"
                                                                 @click="filter.productStatus = 0; getNewData(false)">
                                                                <div class="next-tabs-tab-inner">仓库中的宝贝</div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="next-tabs-content"><!-- react-empty: 80 -->
                                            <div role="tabpanel" aria-hidden="false"
                                                 class="next-tabs-tabpane active"></div><!-- react-empty: 82 --></div>
                                    </div>
                                    <div class="manage-container-filter  ">
                                        <div class="manage-catlist filter-catlist-container">
                                            <div class="sell-o-cat-list " style="display: flex; flex-flow: row wrap;">
                                                <div class="sell-item-box">
                                                    <span>商品标题：</span>
                                                    <el-input v-model="filter.productTitle" placeholder="" size="small" style="width: 150px;"></el-input>
                                                </div>

                                                <div class="sell-item-box">
                                                    <span>商品ID：</span>
                                                    <el-input v-model="filter.productId" placeholder="多个ID以逗号或空格分隔" size="small" style="width: 150px;"></el-input>
                                                </div>

                                                <div class="sell-item-box">
                                                    <span>价格：</span>
                                                    <el-input v-model="filter.productMinPrice" placeholder="" size="small" style="width: 60px;"></el-input>
                                                    --
                                                    <el-input v-model="filter.productMaxPrice" placeholder="" size="small" style="width: 60px;"></el-input>
                                                </div>

                                                <div class="sell-item-box">
                                                    <span>一级类目：</span>
                                                    <template>
                                                        <el-select v-model="filter.categoryId" clearable placeholder="请选择" style="width: 150px;" size="small">
                                                            <el-option
                                                                    v-for="item in filter.firstCategory"
                                                                    :key="item.id"
                                                                    :label="item.name"
                                                                    :value="item.id">
                                                            </el-option>
                                                        </el-select>
                                                    </template>
                                                </div>

                                                <div class="sell-item-box">
                                                    <span>店铺分类：</span>
                                                    <template>
                                                        <el-select v-model="filter.shopCategoryId" clearable placeholder="选择分类" style="width: 150px;" size="small">
                                                            <el-option
                                                                    v-for="item in filter.shopCategory"
                                                                    :key="item.id"
                                                                    :label="item.scName"
                                                                    :value="item.id">
                                                            </el-option>
                                                        </el-select>
                                                    </template>
                                                </div>

                                                <div class="sell-item-box">
                                                    <span>销量：</span>
                                                    <el-input v-model="filter.productMinSale" placeholder="" size="small" style="width: 60px;"></el-input>
                                                    --
                                                    <el-input v-model="filter.productMaxSale" placeholder="" size="small" style="width: 60px;"></el-input>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="filter-footer">
                                            <button type="button"
                                                    class="next-btn next-btn-normal next-btn-medium filter-footer-btn"
                                            @click="getNewData(false)">
                                                <!-- react-text: 190 -->查询<!-- /react-text --></button>
                                            <button type="button"
                                                    class="next-btn next-btn-normal next-btn-medium filter-footer-btn"
                                            @click="resetTerm">
                                                <!-- react-text: 192 -->重置<!-- /react-text --></button>
                                        </div>
                                    </div><!-- react-empty: 193 -->
                                    <div>
                                        <div class="next-affix-top mc-affix-container">
                                            <div class="com-struct list-page-action-toolbar" id="action-struct">
                                                <div class="sell-o-action list-page-operator ">
                                                    <a href="/seller/productCategory.htm" target="_blank">
                                                    <button id="operator" name="smartPublishItemBtn" title="智能发布"
                                                            type="button"
                                                            class="next-btn next-btn-default next-btn-primary next-btn-medium action-item">
                                                        <!-- react-text: 199 -->智能发布<!-- /react-text --></button>
                                                    </a>
                                                    <button id="operator" name="batchDeleteItemBtn" type="button"
                                                            class="next-btn next-btn-default next-btn-normal next-btn-medium action-item"
                                                    @click="batchDeleteProduct">
                                                        <!-- react-text: 205 -->批量删除<!-- /react-text --></button>
                                                    <button id="operator" name="batchDownShelfItemBtn" type="button" v-if="filter.productStatus == 1"
                                                            class="next-btn next-btn-default next-btn-normal next-btn-medium action-item"
                                                    @click="batchOffShelfProduct">
                                                        <!-- react-text: 207 -->批量下架<!-- /react-text --></button>
                                                    <button id="operator" name="batchDownShelfItemBtn" type="button" v-if="filter.productStatus == 0"
                                                            class="next-btn next-btn-default next-btn-normal next-btn-medium action-item"
                                                    @click="batchPutOnTheShelfProduct">
                                                        <!-- react-text: 207 -->批量上架<!-- /react-text --></button>
                                                    <div class="action-total-item-wrap">
                                                        <button type="button"
                                                                class="next-btn next-btn-text next-btn-primary next-btn-medium action-total-item" style="background-color: unset">
                                                            <!-- react-text: 215 -->已选商品( {{productCheckedes.length}} )
                                                            <!-- /react-text --></button>
                                                    </div>
                                                </div>
                                                <div class="com-struct list-page-pagination-toolbar" id="pagination-toolbar">
                                                    <span>共{{filter.productAllPage}}件商品</span>
                                                    <el-pagination
                                                            :current-page="filter.productNowPage"
                                                            @current-change="changeNowPage"
                                                            :pager-count="5"
                                                            background
                                                            :page-size="5"
                                                            layout="prev, pager, next"
                                                            :total="filter.productAllPage">
                                                    </el-pagination>
                                                </div>
                                            </div>
                                        </div>
                                    </div><!-- react-empty: 232 -->
                                    <div class="next-table only-bottom-border zebra manage-o-table  sell-newtable-container "
                                         name="table">
                                        <div class="next-table-inner">
                                            <template>
                                                <el-table
                                                        v-loading="listLoading"
                                                        ref="multipleTable"
                                                        :data="tableData"
                                                        tooltip-effect="dark"
                                                        style="width: 100%"
                                                        @cell-mouse-enter="enterRow"
                                                        @cell-mouse-leave="leaveRow"
                                                        @selection-change="changeProductChecked">
                                                    <el-table-column
                                                            type="selection"
                                                            width="55">
                                                    </el-table-column>
                                                    <el-table-column
                                                            label="商品名称"
                                                            width="300">
                                                        <template slot-scope="scope">
                                                            <a :href="'/buy.htm?pid='+scope.row.productId" target="_blank">
                                                                <img :src="scope.row.productImage" style="width: 80px; height: 80px; float: left;">
                                                            </a>
                                                            <div class="product-desc-hasImg">
                                                                <span class="product-desc-span">
                                                                <a :href="'/buy.htm?pid='+scope.row.productId" target="_blank">{{scope.row.productName}}</a>
                                                                     <el-tag size="small">{{ scope.row.itMethod == 0?'拍下减库存':'付款减库存' }}</el-tag>
                                                                    <a @click="openEditTitleDialog(scope.row)"><i class="iconfont icon-pen_bianji" style="color: grey" v-show="scope.row.editShow"></i></a>
                                                                </span>
                                                                <span class="product-desc-span" style="font-size: 12px; font-weight: normal; color: rgb(153, 153, 153);">ID:{{scope.row.productId}}</span>
                                                            </div>
                                                        </template>
                                                    </el-table-column>
                                                    <el-table-column
                                                            prop="price"
                                                            label="价格"
                                                            sortable>
                                                        <template slot-scope="scope">
                                                            <div class="list-table-price-cell" style="color: rgb(208, 2, 27);">
                                                                <span class="product-desc-span">
                                                                    ¥ {{scope.row.price}}
                                                                    <a @click="openEditPriceDialog(scope.row)"><i class="iconfont icon-pen_bianji" style="color: grey" v-show="scope.row.editShow"></i></a>
                                                                </span>
                                                            </div>
                                                        </template>
                                                    </el-table-column>
                                                    <el-table-column
                                                            prop="count"
                                                            label="库存"
                                                            sortable
                                                            show-overflow-tooltip>
                                                        <template slot-scope="scope">
                                                                <span class="product-desc-span">
                                                                    {{scope.row.count}}
                                                                    <a @click="openEditStockDialog(scope.row)"><i class="iconfont icon-pen_bianji" style="color: grey" v-show="scope.row.editShow"></i></a>
                                                                </span>
                                                        </template>
                                                    </el-table-column>
                                                    <el-table-column
                                                            prop="sales"
                                                            label="销量"
                                                            sortable
                                                            show-overflow-tooltip>
                                                    </el-table-column>
                                                    <el-table-column
                                                            prop="createTime"
                                                            label="创建时间"
                                                            sortable
                                                            show-overflow-tooltip>
                                                        <template slot-scope="scope">
                                                            <span>{{scope.row.createTime}}</span>
                                                            <span class="product-desc-span product-desc-span-success ">{{scope.row.isLanunched == 1?'出售中':'仓库中'}}</span>
                                                        </template>
                                                    </el-table-column>
                                                    <el-table-column
                                                            prop="publishTime"
                                                            sortable
                                                            label="发布时间"
                                                            show-overflow-tooltip>
                                                    </el-table-column>
                                                    <el-table-column
                                                            label="操作"
                                                            show-overflow-tooltip>
                                                        <template slot-scope="scope">
                                                            <div class="sell-o-info">
                                                                <div class="info-content">
                                                                    <div class="sell-o-action  action-vertical">
                                                                        <el-link type="primary" style="color: #2192D9" @click="openEditShopCategory(scope.row)">编辑分类</el-link>
                                                                        <el-link type="success" style="color: #00f;">发布相似品</el-link>
                                                                        <el-link type="warning" style="color: #2192D9" @click="offShelfProduct(scope.row)" v-if="scope.row.isLanunched == 1">立即下架</el-link>
                                                                        <el-link type="warning" style="color: #2192D9" @click="putOnTheShelfProduct(scope.row)" v-if="scope.row.isLanunched == 0">立即上架</el-link>
                                                                        <el-link type="danger" style="color: #2192D9">复制链接</el-link>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </template>
                                                    </el-table-column>
                                                </el-table>

                                            </template>

                                            <!--编辑商品标题界面-->
                                            <el-dialog title="编辑标题" :visible.sync="editTitleVisible" :close-on-click-modal="false">
                                                <el-form :model="editTitle" label-width="80px" :rules="editTitleRules" ref="editTitle">
                                                    <el-form-item label="商品标题" prop="productName">
                                                        <el-input v-model="editTitle.productName" auto-complete="off"></el-input>
                                                    </el-form-item>
                                                    <el-form-item>
                                                        <p><span style="color: #F56C6C">* </span>减库存方式</p>
                                                        <el-radio-group v-model="editTitle.itMethod">
                                                            <el-radio border :label="0">拍下减库存</el-radio>
                                                            <el-radio border :label="1">付款减库存</el-radio>
                                                        </el-radio-group>
                                                    </el-form-item>
                                                    <el-form-item prop="message">
                                                        <span>建议将以下推荐词添加至标题中以提升您的商品表达，请只添加符合您商品描述的内容：</span>
                                                    </el-form-item>
                                                </el-form>
                                                <div slot="footer" class="dialog-footer">
                                                    <el-button type="primary" @click.native="submitEditTitle" :loading="editLoading">提交</el-button>
                                                    <el-button @click.native="editTitleVisible = false">取消</el-button>
                                                </div>
                                            </el-dialog>
                                        </div>
                                    </div>

                                        <!--编辑商品价格界面-->
                                        <el-dialog title="编辑商品价格" :visible.sync="editPriceVisible" :close-on-click-modal="false">
                                            <el-form :model="editPrice" label-width="80px" :rules="editPriceRules" ref="editPrice">
                                                <el-form-item label="商品标题" prop="productName">
                                                    {{ editPrice.productName }}
                                                </el-form-item>
                                                <el-form-item label="商品价格" prop="productNowPrice">
                                                    <el-input-number v-model="editPrice.productNowPrice" auto-complete="off" style="width: 200px" size="small" :controls="false"  :precision="2" :min='0'></el-input-number> 元
                                                </el-form-item>
                                                <el-form-item prop="tb">
                                                    <template>
                                                        <el-table
                                                                :data="productSkus"
                                                                height="300"
                                                                style="width: 100%"
                                                                :row-class-name="skuStockRowTip">
                                                            <el-table-column
                                                                    prop="productSpaceData"
                                                                    label="SKU"
                                                                    width="400">
                                                            </el-table-column>
                                                            <el-table-column
                                                                    prop="productStock"
                                                                    label="库存"
                                                                    width="250">
                                                            </el-table-column>
                                                            <el-table-column
                                                                    prop="productPrice"
                                                                    label="价格">
                                                                <template slot-scope="scope">
                                                                    <el-input-number v-model="scope.row.productPrice" size="small" :controls="false"  :precision="2" :min='0'></el-input-number>
                                                                </template>
                                                            </el-table-column>
                                                        </el-table>
                                                        <span style="color: #f40">{{ editPrice.editWarningTip }}</span>
                                                    </template>
                                                </el-form-item>
                                            </el-form>
                                            <div slot="footer" class="dialog-footer">
                                                <el-button type="primary" @click.native="submitUpdateSkuPrice" :loading="editLoading">提交</el-button>
                                                <el-button @click.native="editPriceVisible = false">取消</el-button>
                                            </div>
                                        </el-dialog>


                                        <!--编辑库存界面-->
                                        <el-dialog title="编辑库存" :visible.sync="editStockVisible" :close-on-click-modal="false">
                                            <el-form :model="editPrice" label-width="80px" ref="editStock">
                                                <el-form-item label="商品标题" prop="productName">
                                                    {{ editPrice.productName }}
                                                </el-form-item>
                                                <el-form-item prop="tb">
                                                    <template>
                                                        <el-table
                                                                :data="productSkus"
                                                                height="300"
                                                                style="width: 100%"
                                                                :row-class-name="skuStockRowTip">
                                                            <el-table-column
                                                                    prop="productSpaceData"
                                                                    label="SKU"
                                                                    width="400">
                                                            </el-table-column>
                                                            <el-table-column
                                                                    prop="productPrice"
                                                                    label="库存">
                                                                <template slot-scope="scope">
                                                                    <el-input-number v-model="scope.row.productStock" size="small" :controls="false"  :precision="0" :min='0'></el-input-number>
                                                                </template>
                                                            </el-table-column>
                                                        </el-table>
                                                        <span style="color: #f40">{{ editPrice.editWarningTip }}</span>
                                                    </template>
                                                </el-form-item>
                                            </el-form>
                                            <div slot="footer" class="dialog-footer">
                                                <el-button type="primary" @click.native="editStockVisible = false; submitUpdateSkuAttr('编辑商品库存成功')" :loading="editLoading">提交</el-button>
                                                <el-button @click.native="editStockVisible = false">取消</el-button>
                                            </div>
                                        </el-dialog>

                                        <!-- 编辑商品分类界面 -->
                                        <el-dialog title="编辑店铺分类" :visible.sync="editCategoryVisible" :close-on-click-modal="false">
                                            <el-descriptions title="所选商品：   点击下方分类行选中需要加入的分类" border>
                                                <el-descriptions-item label="商品图片"><img :src="categoryProduct.productImage" style="width: 80px; height: 60px;"></el-descriptions-item>
                                                <el-descriptions-item label="商品名称">{{ categoryProduct.productName }}</el-descriptions-item>
                                                <el-descriptions-item label="商品价格">{{ categoryProduct.productPrice }}</el-descriptions-item>
                                                <el-descriptions-item label="商品所属分类">
                                                    <el-tag size="small">{{ categoryProduct.productShopCategory.scName }}</el-tag>
                                                </el-descriptions-item>
                                                <el-descriptions-item label="发布时间">{{ categoryProduct.productCreateTime }}</el-descriptions-item>
                                            </el-descriptions>

                                            <!-- 添加新分类 -->
                                            <el-dialog
                                                    width="30%"
                                                    title="添加新分类"
                                                    :visible.sync="addCategoryVisible"
                                                    append-to-body>
                                                <el-form :model="addCategoryForm" :rules="addCategoryRules" rel="addCategoryForm">
                                                <el-form-item label="分类名称" prop="addCategoryName">
                                                    <el-input v-model="addCategoryForm.addCategoryName"></el-input>
                                                </el-form-item>
                                                <el-form-item>
                                                        <el-button type="primary" @click.native="submitAddCategory('addCategoryForm')" :loading="editLoading">提交</el-button>
                                                        <el-button @click.native="addCategoryVisible = false">取消</el-button>
                                                </el-form-item>
                                                </el-form>
                                            </el-dialog>

                                            <!-- 分类 -->
                                            <template>
                                                <div style="border: 1px solid lightgray; margin-top: 20px;">
                                                <el-table height="240"
                                                        ref="singleTable"
                                                        :data="categorys"
<%--                                                        :show-header="false"--%>
                                                        highlight-current-row
                                                        @current-change="handleCurrentChange"
                                                        style="width: 100%">
                                                    <el-table-column
                                                            property="categoryName"
                                                            label="分类名称"
                                                            width="303">
                                                    </el-table-column>
                                                    <el-table-column
                                                            property="categoryCreateTime"
                                                            label="创建时间"
                                                            width="303">
                                                    </el-table-column>
                                                    <el-table-column
                                                            property="categoryCreateTime"
                                                            label="选中状态"
                                                            width="303">
                                                        <template slot-scope="scope">
                                                            <el-tag effect="dark" type="" v-if="scope.row.isChecked">已选中</el-tag>
                                                            <el-tag effect="dark" type="info" v-if="!scope.row.isChecked">未选中</el-tag>
                                                        </template>
                                                    </el-table-column>
                                                </el-table>
                                                </div>
                                                <div style="margin-top: 20px">
                                                    <el-button @click="addCategoryVisible = true">添加分类</el-button>
                                                    <el-button @click="deleteCategory">删除分类</el-button>
                                                </div>
                                            </template>

                                            <div slot="footer" class="dialog-footer">
                                                <el-button type="primary" @click.native="productGotoCategory" :loading="editLoading">提交</el-button>
                                                <el-button @click.native="editCategoryVisible = false">取消</el-button>
                                            </div>
                                        </el-dialog>

                                        <div class="next-pagination next-pagination-normal next-pagination-medium medium ol-next-pagination list-page-pagination"
                                             name="pagination" label="分页器" style="    float: right;">
                                            <el-pagination
                                                    :current-page="filter.productNowPage"
                                                    @current-change="changeNowPage"
                                                    :pager-count="5"
                                                    background
                                                    :page-size="5"
                                                    layout="prev, pager, next"
                                                    :total="filter.productAllPage">
                                            </el-pagination>
                                        </div>
                                    </div>
                                </div>
                                    <span id="bottom-advertising-tip" class="ol-text bottom-advertising-tip">以下是第三方广告推广，非阿里巴巴官方工具，请自行评估使用</span>
                                    <!-- react-empty: 288 --><!-- react-empty: 289 --></div>
                            </div>
                        </div>
                    </div>
                </div>
                <ins style="display:inline-block;padding:0;margin:0;width:840px;height:90px;*zoom:1;*display:inline; position:relative;"
                     id="tanxssp-outer-conmm_12852562_1778064_108807550023">
                    <div id="tanxssp_con_mm_12852562_1778064_108807550023"
                         style="overflow:hidden;display:inline-block;position:relative;width:840px;height:90px;*display:inline;*zoom:1;font:12px/1.5 tahoma,'Hiragino Sans GB','microsoft yahei',sans-serif;">
                        <a href="https://click.mz.simba.taobao.com/ecpm?eadt=17&amp;e=szY5LFGosiESXnZCiezO6hsQmLP5zomMjmSFtvb6TRuP1%2BRhW0L%2FTvOp2bRlvCaSjJbVskTzR0PpYfR0QmxXX3uWL0L60sw2LkfU0NcJTpO3GHJUMMv49ozKMsXVWnpEmJ6vcUJvSdZ1RFnEhK2x6GGNK%2BkULPo8mSX9d5wF0NZqP4CGp3%2BT2d2lBt1rmVUVRTJbtcRCE%2FYolf9AUBWPllEZIJUzy3Ujr7TJEINbofGgSc4N8mgC1xdeXvmld3z77j3I0u9gDNqga2lOLv5Yv9%2FBBdXXDnN5qz1FT%2BtKALGXEI7HUopFYAYKpJCWoADkqz1FT%2BtKALGJjeACvHtN5NcRMJ0e3bG%2B31Uc%2F6ogJRbfVRz%2FqiAlFhPYlHYcaV2VfCa22tJHJQ1PefAGXvWWEQ4EJwo7N1wA%2BB9zailvxWWwVYePWtS9PpVzQ3FPhUQ2Ul%2F6Rys%2Bb6nZe4RCu1NqShgXaiCsUCBTjdQvu25N1E7yGVf6%2Bdv6PcL5Iyu5jXDCCo0Cqzd%2BkEKD7pDDIVokV9iqHpU1GQ9lKUf280lKnip5fWXFFve439hjtwHJosVpeQY%2FuKqjDLyl1fw4JTxoD0x7b11RaZSosMClRVsnU41sQJS%2Bk%2BEALedotvTYg2YOO9cqoVXUF%2FWRyYjtZwD77HSWRmrDPkWu3SsGhE6XTTScYzgsSnnwophF0F9TdJCq&amp;u=https%3A%2F%2Ffuwu.taobao.com%2Fserv%2Fshop_index.htm%3Fisv_id%3D914055344%26tab%3D5&amp;k=705"
                           target="_blank"><img border="0"
                                                src="https://img.alicdn.com/simba/img/TB1MQtbifzO3e4jSZFxSuuP_FXa.jpg"
                                                width="840px" height="90px"></a></div>
                </ins>
                <a style="display:none;" id="tanx-a-mm_12852562_1778064_108807550023"></a>
                <script src="https://ecpm.tanx.com/ex?i=mm_12852562_1778064_108807550023&amp;cb=jsonp_callback_22741&amp;callback=&amp;userid=&amp;o=&amp;f=&amp;n=&amp;r=https%3A%2F%2Fitem.manager.taobao.com%2Ftaobao%2Fmanager%2Frender.htm%3Fpagination.current%3D1%26pagination.pageSize%3D20%26tab%3Don_sale%26table.sort.managerPrice%3Ddesc&amp;cg=a93229851d709a86fdee1fbbc9d218de&amp;pvid=d8fabfc2e3cd067fd67359c3d3a785d7&amp;u=https%3A%2F%2Fitem.manager.taobao.com%2Ftaobao%2Fmanager%2Frender.htm%3Fpagination.current%3D1%26pagination.pageSize%3D20%26tab%3Don_sale%26table.sort.managerPrice%3Dasc&amp;psl=1&amp;nk=97%2C110%2C115%2C101%2C110%2C49%2C54%2C49%2C57%2C53&amp;sk=&amp;refpid="></script>


            </div>
        <!-- 左侧导航栏 -->
        <jsp:include page="seller_left_nav.jsp"></jsp:include>
        </div>
    </div>
</div>
<jsp:include page="/public_page/open_chat.jsp"></jsp:include>
</body>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script>
    var app = new Vue({
        el: '#app',
        data: {
            filter: {
                productTitle: '',
                productId: '',
                productMinPrice: '',
                productMaxPrice: '',
                firstCategory: [],
                categoryId: '',
                shopCategory: [],
                shopCategoryId: '',
                productMinSale: '',
                productMaxSale: '',
                productStatus: 9999,
                productPageSize: 5,
                productAllPage: 0,
                productNowPage: 1,
            },
            // 最大表格展示数据
            tableData: [],
            listLoading: false,
            // 表格复选框批量选中
            productCheckedes: [],
            // 商品标题编辑
            editTitleVisible: false,
            editTitleRules: {
                productName: [
                    { required: true, message: '请输入姓名', trigger: 'blur' }
                ]
            },
            editTitle: {
                productId: '',
                productName: '',
                itMethod: '',
            },
            // 商品SKU价格编辑
            editPriceVisible: false,
            editPriceRules: {
                productName: [
                    { required: true, message: '请输入姓名', trigger: 'blur' }
                ],
            },
            editPrice: {
                productId: '',
                productName: '',
                productNowPrice: '',
                productMaxPrice: '',
                productMinPrice: '',
                editWarningTip: '',
            },
            // 商品SKU库存编辑
            editStockVisible: false,
            // 商品sku属性组多个，公用数据
            productSkus: [],

            // 商品分类编辑
            editCategoryVisible : false,
            categoryProduct: {
                productId: '',
                productImage: '',
                productName: '',
                productPrice: '',
                productShopCategory: '',
                productCreateTime: '',
            },
            categorys: [],
            editCategoryProductVal: {},
            // 新增分类
            addCategoryVisible: false,
            addCategoryForm : {
                addCategoryName: '',
            },
            // 新增类别规则：
            addCategoryRules:{
                addCategoryName :[
                    { required: true, message: '请输入分类名称', trigger: 'blur' },
                ]
            },
            currentRow: null,


            editLoading: false,
        },
        methods: {
            getNewData(isPagination){
                if(!isPagination){
                    this.filter.productNowPage = 1;
                }
                this.listLoading = true;
                let _this = this;
                axios.post("/seller_logic/findRender.htm", this.filter).then(function (res) {
                    let response = res.data[1];
                    let val = [];
                    // 设置总页数
                    _this.filter.productAllPage = res.data[0];
                    console.log(response)
                    for (let i = 0; i < response.length; i++) {
                        let product = {
                        productId: response[i]['id'],
                        productName: response[i]['productName'],
                        productImage: response[i]['productImages'][0]['imagePath'],
                        price: response[i]['nowPrice']+".00",
                        count: response[i]['productCount'],
                        sales: response[i]['dealCount'],
                        isLanunched: response[i]['isLanunched'],
                        scid: response[i]['scid'],
                        shopCategory: response[i]['shop']['shopCategory'],
                        createTime: response[i]['createTime'],
                        publishTime: response[i]['publishTime'],
                        itMethod: response[i]['itMethod'],
                        editShow: false
                        }
                        val.push(product);
                    }
                    _this.tableData = val;
                    setTimeout(function () {
                        _this.listLoading = false;
                    },300);
                })
            },
            // 获得普通分类
            getCategory(){
                let categoryIds = new Array();
                axios.post("/seller_logic/findAllSellerProduct.htm").then( res=> {
                    let response = res.data;
                    for (let i = 0; i < response.length; i++) {
                        categoryIds.push(response[i]['belongCategoryId']);
                    }

                    this.filter.firstCategory = [];
                    axios.post("/seller_logic/findCategoryByCid.htm", {categoryIds: categoryIds}).then( res =>{
                        for (let i = 0; i < res.data['data'].length; i++) {
                            let dt = {
                                id: res.data['data'][i]['id'],
                                name: res.data['data'][i]['name']
                            }
                            this.filter.firstCategory.push(dt);
                        }
                    })
                });
            },
            // 获得店铺分类
            getShopCategory(){
                axios.post("/seller_logic/findAllShopCategory.htm").then(res =>{
                    var response = res.data['data'];
                    console.log(response);
                    this.filter.shopCategory = response;
                });
            },
            // 重置条件
            resetTerm(){
                this.filter = {
                    productTitle: '',
                    productId: '',
                    productMinPrice: '',
                    productMaxPrice: '',
                    firstCategory: this.filter.firstCategory,
                    categoryId: '',
                    shopCategory: this.filter.shopCategory,
                    shopCategoryId: '',
                    productMinSale: '',
                    productMaxSale: '',
                    productStatus: this.filter.productStatus,
                    productPageSize: 5,
                    productAllPage: this.filter.productStatus,
                    productNowPage: 1,
                };
                this.getNewData(false);
            },
            enterRow(val){
                val.editShow = true;
            },
            leaveRow(val){
                val.editShow = false;
            },
            // 改变表格中多个商品选中状态
            changeProductChecked(val){
                this.productCheckedes = val;
            },
            // 打开编辑标题框
            openEditTitleDialog(val){
                this.editTitleVisible = true;
                this.editTitle.productId = val.productId;
                this.editTitle.productName = val.productName;
                this.editTitle.itMethod = val.itMethod;
            },
            // 提交编辑标题
            submitEditTitle(){
                let _this = this;
                axios.post("/seller_logic/updateProductName.htm", {productId: this.editTitle.productId, productName: this.editTitle.productName, itMethod: this.editTitle.itMethod}).then(function (res) {
                    let response = res.data;
                    let isSuccess = response['success'];
                    let text = response['data'];
                    _this.editTitleVisible = false;
                    _this.$message({
                        showClose: true,
                        message: text,
                        type: 'success',
                        offset: 400
                    });
                    if(isSuccess){
                        _this.getNewData(true);
                    }
                });

            },
            // 点击打开编辑价格界面
            openEditPriceDialog(val){
                this.editPriceVisible = true;
                this.findProductSkuData(val);
            },
            // 加载商品sku数据
            findProductSkuData(val){
                this.editPrice.productId = val.productId;
                this.editPrice.productName = val.productName;
                this.editPrice.productNowPrice = val.price;
                axios.post("/seller_logic/getProductSkus.htm", {productId: val.productId}).then( res =>{
                    let response = res.data;
                    // 格式化sku
                    let prices = new Array();
                    for (let i = 0; i < response['data'].length; i++) {
                        response['data'][i]['productSpaceData'] = formatSkuJson(response['data'][i]['productSpaceData']);
                        response['data'][i]['productPrice'] = parseFloat(response['data'][i]['productPrice']+".00");
                        prices.push(response['data'][i]['productPrice']);
                    }
                    this.productSkus = response['data'];
                    this.editPrice.productMaxPrice = Math.max.apply(null, prices);
                    this.editPrice.productMinPrice = Math.min.apply(null, prices);
                })
            },
            // 点击打开编辑库存界面
            openEditStockDialog(val){
                this.editStockVisible = true;
                this.findProductSkuData(val);
            },
            // 提交修改sku价格
            submitUpdateSkuPrice(){
                if (this.editPrice.productNowPrice == null) {
                    this.editPrice.editWarningTip = "价格为必填项，不能为空";
                    return false;
                }
                if (this.editPrice.productNowPrice > this.editPrice.productMaxPrice) {
                    this.editPrice.editWarningTip = "宝贝价格不能超过销售属性[颜色分类]表中的最高价，不包括库存为0的宝贝价格";
                    return false;
                } else if(this.editPrice.productNowPrice < this.editPrice.productMinPrice){
                    this.editPrice.editWarningTip = "宝贝价格不能低于销售属性[颜色分类]表中的最低价，不包括库存为0的宝贝价格";
                    return false;
                }
                this.submitUpdateSkuAttr("编辑商品价格成功");
            },
            // 修改商品sku属性
            submitUpdateSkuAttr(msg){
                axios.post("/seller_logic/updateProductSkuAttr.htm", {skus: this.productSkus, price: this.editPrice.productNowPrice}).then( res=>{
                    this.editPriceVisible = false;
                    this.editLoading = false;
                    this.$message({
                        showClose: true,
                        message: msg,
                        type: 'success',
                        offset: 400
                    });
                   this.getNewData(true);
                })
            },
            // 下架商品
            offShelfProduct(val) {
                this.$confirm('是否确认下架？宝贝下架后请到"仓库中的宝贝"查看并管理宝贝', '立即下架', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                    center: true
                }).then(() => {
                    axios.post("/seller_logic/updateProductStatus.htm", {products: [val], isUpdate: true, status: 0, isDelete: false, deleteStatus: 0}).then(res =>{
                        this.$message({
                            showClose: true,
                            type: 'success',
                            message: '商品下架成功！',
                            offset: 400
                        });
                        this.getNewData(true);
                    });
                }).catch(() => {
                    this.$message({
                        showClose: true,
                        type: 'info',
                        message: '已取消下架',
                        offset: 400
                    });
                });
            },
            // 上架商品
            putOnTheShelfProduct(val){
                this.$alert('是否确认上架？', '立即上架', {
                    confirmButtonText: '确定',
                    callback: action => {
                        if(action == "confirm") {
                            axios.post("/seller_logic/updateProductStatus.htm", {
                                products: [val],
                                isUpdate: true, status: 1, isDelete: false, deleteStatus: 0
                            }).then(res => {
                                this.$message({
                                    showClose: true,
                                    type: 'success',
                                    message: '商品上架成功！',
                                    offset: 400
                                });
                                this.getNewData(true);
                            });
                        }
                    }
                });
            },
            // 批量删除
            batchDeleteProduct(){
                this.$confirm('是否确认删除？ 删除宝贝后可到“商品回收站”查看并恢复被删除的宝贝。', '批量删除', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                    center: true
                }).then(() => {
                    if(this.productCheckedes.length<1){
                        this.$message({
                            showClose: true,
                            type: 'error',
                            message: '选择不能为空',
                            offset: 400
                        });
                        return false;
                    }
                    axios.post("/seller_logic/updateProductStatus.htm", {products: this.productCheckedes, isUpdate: false, status: 0, isDelete: true, deleteStatus: 1}).then(res =>{
                        this.$message({
                            showClose: true,
                            type: 'success',
                            message: this.productCheckedes.length+'个商品删除成功！',
                            offset: 400
                        });
                        this.getNewData(true);
                    });
                }).catch(() => {
                    this.$message({
                        showClose: true,
                        type: 'info',
                        message: '已取删除',
                        offset: 400
                    });
                });
            },
            // 批量下架
            batchOffShelfProduct(){
                this.$confirm('是否确认下架？宝贝下架后请到"仓库中的宝贝"查看并管理宝贝', '批量下架', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                    center: true
                }).then(() => {
                    if(this.productCheckedes.length<1){
                        this.$message({
                            showClose: true,
                            type: 'error',
                            message: '选择不能为空',
                            offset: 400
                        });
                        return false;
                    }
                    axios.post("/seller_logic/updateProductStatus.htm", {products: this.productCheckedes, isUpdate: true, status: 0, isDelete: false, deleteStatus: 0}).then(res =>{
                        this.$message({
                            showClose: true,
                            type: 'success',
                            message: this.productCheckedes.length+'个商品下架成功！',
                            offset: 400
                        });
                        this.getNewData(true);
                    });
                }).catch(() => {
                    this.$message({
                        showClose: true,
                        type: 'info',
                        message: '已取消下架',
                        offset: 400
                    });
                });
            },
            // 批量上架
            batchPutOnTheShelfProduct(){
                this.$alert('是否确认上架？', '批量上架', {
                    confirmButtonText: '确定',
                    callback: action => {
                        if(action == "confirm") {
                            if(this.productCheckedes.length < 1){
                                this.$message({
                                    showClose: true,
                                    type: 'error',
                                    message: '选择不能为空',
                                    offset: 400
                                });
                                return false;
                            }
                            axios.post("/seller_logic/updateProductStatus.htm", {
                                products: this.productCheckedes,
                                isUpdate: true, status: 1, isDelete: false, deleteStatus: 0
                            }).then(res => {
                                this.$message({
                                    showClose: true,
                                    type: 'success',
                                    message: this.productCheckedes.length+'个商品上架成功！',
                                    offset: 400
                                });
                                this.getNewData(true);
                            });
                        }
                    }
                });
            },
            getEditCategortDara(){
                var productId = this.editCategoryProductVal.productId;
                axios.post("/seller_logic/findOneProduct.htm", {productId: productId}).then(res =>{

                    let response = res.data['data'];
                    this.categoryProduct.productId = response['id'];
                    this.categoryProduct.productImage = response['productImages'][0]['imagePath'];
                    this.categoryProduct.productName = response['productName'];
                    this.categoryProduct.productPrice = response['nowPrice'];
                    this.categoryProduct.productShopCategory = response['shop']['shopCategory'];
                    this.categoryProduct.productCreateTime = response['publishTime'];
                })
                axios.post("/seller_logic/findAllShopCategory.htm").then(res =>{
                    let response = res['data']['data'];
                    this.categorys = [];
                    for (let i = 0; i < response.length; i++) {
                        let val = {
                            id: response[i]['id'],
                            index: i,
                            categoryName : response[i]['scName'],
                            categoryCreateTime: response[i]['createTime'],
                            isChecked: false}
                        this.categorys.push(val);
                    }
                })
            },
            // 打开店铺分类编辑界面
            openEditShopCategory(val){
                this.editCategoryProductVal = val;
                this.editCategoryVisible = true;
                this.getEditCategortDara();
            },
            // 改变分类选中状态
            handleCurrentChange(val) {
                for (let i = 0; i < this.categorys.length; i++) {
                    this.categorys[i].isChecked = false;
                }
                this.categorys[val.index].isChecked = true;
            },
            // 提交添加新分类
            submitAddCategory(){
              var addCategoryName = this.addCategoryForm.addCategoryName;
              if(addCategoryName.length < 1){
                  this.$message({
                      showClose: true,
                      type: 'error',
                      message: '请输入分类名称！',
                      offset: 400
                  });
                  return false;
              }
              axios.post("/seller_logic/addShopCategory.htm", {categoryName : addCategoryName}).then(res=>{
                  console.log(res);
                  let response = res.data;
                  let isSuccess = response['success'];
                  if(isSuccess){
                      this.$message({
                          showClose: true,
                          type: 'success',
                          message: '添加新分类成功！',
                          offset: 400
                      });
                      this.getEditCategortDara();
                      this.addCategoryVisible = false;
                      this.addCategoryForm.addCategoryName = '';
                  } else{
                      this.$message({
                          showClose: true,
                          type: 'error',
                          message: '添加失败，分类名重复',
                          offset: 400
                      });
                  }
              })
            },
            // 删除分类
            deleteCategory(){
                    this.$confirm('是否删除该分类? (改分类下的所有宝贝将无分类)', '删除分类', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        // 获取选中要删除的行
                        let isHaveChecked = false;
                        let category = {};
                        for (let i = 0; i < this.categorys.length; i++) {
                            if(this.categorys[i].isChecked){
                                isHaveChecked = true;
                                category = this.categorys[i];
                                break;
                            }
                        }
                        if(!isHaveChecked){
                            this.$message({
                                type: 'warning',
                                message: '请选择需要删除的分类！',
                                offset: 400
                            });
                            return false;
                        }
                        // 删除
                        axios.post("/seller_logic/deleteShopCategory.htm", {shopCategoryId: category.id}).then(res =>{
                            this.$message({
                                type: 'success',
                                message: '删除成功!',
                                offset: 400
                            });
                            this.getEditCategortDara();
                            this.getNewData();
                        });
                    }).catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消删除',
                            offset: 400
                        });
                    });
            },
            // 选中商品添加至选中分类中
            productGotoCategory(){
                // 获取选中商品id和分类id
                let productId = this.categoryProduct.productId;
                let isHaveChecked = false;
                let category = {};
                for (let i = 0; i < this.categorys.length; i++) {
                    if(this.categorys[i].isChecked){
                        isHaveChecked = true;
                        category = this.categorys[i];
                        break;
                    }
                }
                if(!isHaveChecked){
                    this.$message({
                        type: 'warning',
                        message: '请选择该宝贝需要加入的分类！',
                        offset: 400
                    });
                    return false;
                }
                let categoryId = category.id;
                axios.post("/seller_logic/productGotoCategory.htm", {productId: productId, scid: categoryId}).then(res=>{
                    this.$message({
                        type: 'warning',
                        message: '该宝贝添加至分类['+category.categoryName+']成功',
                        offset: 400
                    });
                    this.editCategoryVisible = false;
                });
            },



            // 改变当前页数
            changeNowPage(val) {
                this.filter.productNowPage = val;
                this.getNewData(true);
            },
            // sku库存低于10触发不同背景色
            skuStockRowTip({row, rowIndex}) {
                if (row['productStock'] < 10) {
                    return 'warning-row';
                }else{
                    return 'success-row';
                }
                return '';
            }
        },
        mounted(){
            this.getCategory();
            this.getShopCategory();
            this.getNewData(false);
        }
    });

    function formatSkuJson(skuJson){
        var splitSku = skuJson.toString().replaceAll("{", "").replaceAll("}", "").replaceAll("\"", "").split(",");
        var sku = "";
        for (let i = 0; i < splitSku.length; i++) {
            sku += splitSku[i].split("|")[0]+" ";
        }
        return sku;
    }

    function formatMoney(number, decimals = 0, decPoint = '.', thousandsSep = ',') {
        number = (number + '').replace(/[^0-9+-Ee.]/g, '')
        const n = !isFinite(+number) ? 0 : +number
        const prec = !isFinite(+decimals) ? 0 : Math.abs(decimals)
        const sep = (typeof thousandsSep === 'undefined') ? ',' : thousandsSep
        const dec = (typeof decPoint === 'undefined') ? '.' : decPoint
        let s = ''
        const toFixedFix = function(n, prec) {
            const k = Math.pow(10, prec)
            return '' + Math.ceil(n * k) / k
        }
        s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.')
        const re = /(-?\d+)(\d{3})/
        while (re.test(s[0])) {
            s[0] = s[0].replace(re, '$1' + sep + '$2')
        }
        if ((s[1] || '').length < prec) {
            s[1] = s[1] || ''
            s[1] += new Array(prec - s[1].length + 1).join('0')
        }
        return s.join(dec)
    }

    function formatDecimals(number, decimals = 2) {
        return formatMoney(number, decimals, '.', '')
    }
</script>
</html>
